<template>
	<view class="comment-body">
		<block v-for="(item,index) in detail.list" :key="index">
			<detail-info :item="item" :index="index"></detail-info>
		</block>
		
		<!-- 评论 -->
		<view class="u-comment-title">最新评论 {{comment.count}}</view>
		<view class="uni-comment u-comment">
			
			<block v-for="(item,index) in comment.list" :key="index">
				<commentList :item="item" :index="index"></commentList>
			</block>
			<view style="height:140upx;"></view>
		</view>
		<userChatBottom @submit="submit"></userChatBottom>
		
		
		<!-- 分享 -->
			<moreShare @toggleshare="toggleshare" :shareshow="shareshow"></moreShare>
			
	</view>
</template>

<script>
	import time from '../../common/time.js'
	import detailInfo from '../../components/detail/detail-info.vue'
	import commentList from '../../components/comment-list/comment-list.vue'
	import userChatBottom from '../../components/user-chat/user-chat-bottom.vue'
	import moreShare from '../../components/common/more-share.vue'
	export default {
		components:{
			detailInfo, 
			commentList,
			userChatBottom,
			moreShare
		},
		data() {
			return {
				shareshow:false,
				detail: {
					loadtext: '上拉加载更多...',
					list: [
						// 视频
						{
							userpic: '../../static/demo/userpic/4.jpg',
							username: '哈哈111',
							sex: 0, // 0 男，1 女
							age: 20,
							isguanzhu: false,
							title: '我是标题1',
							titlepic: '../../static/demo/datapic/9.jpg',
							morpic:['../../static/demo/datapic/9.jpg','../../static/demo/datapic/10.jpg','../../static/demo/datapic/11.jpg','../../static/demo/datapic/12.jpg'],
							video: {
								looknum: "20w",
								long: '2:47'
							},
							share: false,
							path: "深圳 龙岗",
							sharenum: 20,
							commentnum: 30,
							goodnum: 20
						},
					]
				},
				comment:{
					count:20,//评论数量
					//评论列表
					list:[]
				}
			}
		},
		methods: {
			// 显示/隐藏分享
			toggleshare(){
				this.shareshow = !this.shareshow
			},
			// 提交评论数据
			submit(data){
				let obj = {
					id:1,
					fid:0,
					userpic:"https://img-cdn-qiniu.dcloud.net.cn/uniapp/images/uni@2x.png",
					username:"小猫咪",
					time:time.gettime.gettime(new Date().getTime()),//评论时间
					data:data//评论内容
				};
				this.comment.list.push(obj)
			},
			// 获取评论数据
			getcommentdata(){
				let arr = [
					// 一级评论
						{
							id:1,
							fid:0,
							userpic:"https://img-cdn-qiniu.dcloud.net.cn/uniapp/images/uni@2x.png",
							username:"小猫咪",
							time:"1575511091",//评论时间
							data:"支持国产，支持DCloud!"//评论内容
						},
						{
							id:2,
							fid:1,
							userpic:"https://img-cdn-qiniu.dcloud.net.cn/uniapp/images/uni@2x.png",
							username:"小猫咪",
							time:"1575518691",//评论时间
							data:"支持国产，支持DCloud!"//评论内容
						},
						{
							id:3,
							fid:0,
							userpic:"https://img-cdn-qiniu.dcloud.net.cn/uniapp/images/uni@2x.png",
							username:"小猫咪",
							time:"1575518691",//评论时间
							data:"支持国产，支持DCloud!"//评论内容
						},
					
				]
				
				arr.forEach((el)=>{
					el.time = time.gettime.gettime(el.time)
				})
				
				this.comment.list = arr
			},
			initData(obj){
				uni.setNavigationBarTitle({
					title:obj.title
				})
			}
		},
		// 监听导航栏按钮事件 
		onNavigationBarButtonTap(e){
			if(e.index === 0){
				this.toggleshare()
			}
		},
		onLoad(e) {
			this.initData(JSON.parse(e.detailData))
			console.log(JSON.parse(e.detailData))
			this.getcommentdata()
			
		}
	}
</script>

<style>
	/* 评论 */
	.u-comment-title {
		padding: 0 20upx;
	}
	.u-comment {
		padding: 0 20upx; 
	}
	
	/* 分享 */
	

</style>
 